{extend name="layout:base" /}

{block name="content"}
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form">
                <input type="hidden" name="id" value="{$article.id}">
                <div class="layui-row layui-col-space10 layui-form-item">
                    <div class="layui-col-lg12">
                        <label class="layui-form-label">标题：</label>
                        <div class="layui-input-block">
                            <input type="text" name="title" autocomplete="off" class="layui-input" value="{$article.title}">
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space10 layui-form-item">
                    <div class="layui-col-lg12">
                        <label class="layui-form-label">栏目：</label>
                        <div class="layui-inline">
                            <select name="cid" id="cid" lay-filter="cid">
                                {volist name="category_list" id="vo"}
                                    {eq name="vo.id" value="$article['cid']"}
                                        <option value="{$vo.id}" selected="selected">{$vo.title}</option>
                                    {else/}
                                        <option value="{$vo.id}" >{$vo.title}</option>
                                    {/eq}
                                {/volist}
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space10 layui-form-item">
                    <div class="layui-col-lg12">
                        <label class="layui-form-label">图片：</label>
                        <div class="layui-input-inline">
                            <input type="text" name="image" id="imageurl" autocomplete="off"
                                   class="layui-input" value="{$article.image}">
                        </div>
                        <input type="button" id="btnImgUpload" value="上传图片" class="layui-btn"/>
                        <div class="layui-form-mid layui-word-aux">建议尺寸：570*420</div>
                    </div>
                </div>
                <div class="layui-row layui-col-space10 layui-form-item">
                    <div class="layui-col-lg12">
                        <label class="layui-form-label">简介：</label>
                        <div class="layui-input-block">
                            <textarea name="description" class="layui-textarea">{$article.description}</textarea>
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space10 layui-form-item">
                    <div class="layui-col-lg12">
                        <label class="layui-form-label">内容：</label>
                        <div class="layui-input-block">
                            <textarea name="content" class="layui-textarea" style="width: 100%;min-height:300px;">{$article.content}</textarea>
                        </div>
                    </div>
                </div>

                <div class="layui-form-item layui-layout-admin">
                    <div class="layui-input-block">
                        <div class="layui-footer" style="left: 0;">
                            <button class="layui-btn" lay-submit="" lay-filter="btnSave">保存</button>
                            <a class="layui-btn layui-btn-primary" href="javascript:parent.location.reload();">返回</a>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
{/block}

{block name="script"}
<script>

    layui.config({
        base: '__STATIC__/layuiadmin/' //静态资源所在路径
    }).extend({
        index: '/lib/index' //主入口模块
    }).use(['index', 'table', 'jquery', 'layer', 'form'], function () {
        var $ = layui.$, form = layui.form;

        form.on('submit(btnSave)', function (data) {
            data.field.content = editor.html();
            $.post("{:url('edit')}", data.field, function (result) {
                console.log(result);
                if (result['code'] == 0) {
                    layer.msg(result['msg'], {icon: 1, time: 1000}, function () {
                        parent.location.reload();
                    });
                } else {
                    layer.msg(result['msg'], {icon: 3, time: 3000});
                }
            });
            return false;
        });
    });

    var editor;
    KindEditor.ready(function (K) {
        editor = K.create('textarea[name="content"]', {
            allowFileManager: true
        });
        K('#btnImgUpload').click(function () {
            editor.loadPlugin('image', function () {
                editor.plugin.imageDialog({
                    imageUrl: K('#imageurl').val(),
                    clickFn: function (url, title, width, height, border, align) {
                        K('#imageurl').val(url);
                        editor.hideDialog();
                        K('#imageView').html('');
                        K('#imageView').append('<img src="' + url + '" height="50">');
                    }
                });
            });
        });
    });
</script>
{/block}